<template>
  <div>
    <el-dialog title="图文展示" width="50%" :visible.sync="dialogVisible" top="15vh" class="showDialogClass"
      :before-close="handleClose">
      <h1 style="font-size:30px">
        {{ textTitle }}
      </h1>
      <el-row class="row-con">
        <el-col :span="10">
          <el-card class="card" :body-style="{ padding: '0px' }" shadow="hover">
            <img :src="textImage" class="image">
            <div style="padding: 14px;">
              <p>简介:{{ description }}</p>
            </div>
          </el-card>
        </el-col>
      </el-row>
      <div style="width:100%;height:auto;overflow-y:scroll">
        <p v-html="textContent" />
      </div>
    </el-dialog>
  </div>
</template>
  
<script>
export default {
  name: `helpTextImgDialog`,
  data() {
    return {
      dialogVisible: false,
      loading: false,
      textContent: ``,
      textTitle: ``,
      textImage: ``,
      description: "",
    }
  },
  methods: {
    inits(item) {
      this.dialogVisible = true;
      this.getDocByid(item)
    },
    getDocByid(item) {
      this.textTitle = item.textTitle
      this.textContent = item.textContent
      this.textImage = item.textImage
      this.description = item.description
    },
    handleClose() {
      this.cancel()
    },
    cancel() {
      this.dialogVisible = false
    },
  },
}
</script>
<style scoped>
.image {
    width: 100%;
    height: 172px;
    display: block;
}
</style>
  
  